<template>
	<block>
		<view class="container">
			<view class="logo2">
				<image src="/static/images/logo2.png" />
			</view>
			<view class="formContainer">
				<form>
					<view class="usernameContainer">
						<image src="/static/images/login-user.png"></image>
						<input name="userName" v-model="loginData.userName"  type="text" placeholder="用户名" />
					</view>
					<view class="passwordContainer">
						<image src="/static/images/login-password.png"></image>
						<input name="password"  v-model="loginData.password" type="password" placeholder="密码" />
					</view>
					<button class="loginBtn" @click="loginsubmit" type="primary">登 录</button>
					<button class="loginBtn_zc" @click="loginregister" >注 册</button>
				</form>
			</view>
		</view>
	</block>
</template>

<script>
	export default {
		data() {
			return {
				loginData:{
					userName: '',
					password: '',
				}

			};
		},
		methods: {
			loginsubmit(){
				if (this.loginData.userName.length<1) {
					uni.showToast({
						title: '请输入用户名',
						icon : 'none',
					});
					return;
				}
				if (this.loginData.password.length<1) {
					uni.showToast({
						title: '请输入登录密码',
						icon : 'none',
					});
					return;
				}
				uni.request({
					url:'/api/users/login',
					method:"POST",
					data:this.loginData,
					success:(res) => {
					if (res.data.code === "001") {
						let data = res.data;
						console.log(data)
						uni.setStorageSync("userName", data.user.userName);
						uni.setStorageSync("userid", data.user.user_id);
						uni.showToast({
						    title:  res.data.msg,
							icon : 'none',
							duration:1000
						});
						setTimeout(function() {
									uni.reLaunch({
										url: '/pages/user/user'
									})
								}, 1000);
					} else{
						uni.showToast({
						    title:  res.data.msg,
							icon : 'none',
						});
					}
					},
					fail:(res)=>{
					
					}
					
				
				});
				},
				loginregister(){
					if (this.loginData.userName.length<1) {
						uni.showToast({
							title: '请输入用户名',
							icon : 'none',
						});
						return;
					}
					if (this.loginData.password.length<1) {
						uni.showToast({
							title: '请输入登录密码',
							icon : 'none',
						});
						return;
					}
					uni.request({
						url:"http://1.14.101.56:82/users/register",
						method:"POST",
						data:this.loginData,
						success: (res) => {
							console.log(res)
							if(res.data.code === "001"){
							uni.showToast({
							    title:  '注册成功',
								icon : 'none',
								});
							}
						},
						fail: () => {
							
						}
					})
					
				}
			
		
		     
		}
	};

</script>
<style>
	.container {
		z-index: -2;
		width: 100vw;
		height: 100vh;
		background-color: #efd5ce;
	}

	.logo2 image {
		left: 50rpx;
		height: 50vh;
		margin-left: 13rpx;
		margin-bottom: 5rpx;
		z-index: 100;
	}

	.formContainer {
		width: 80%;
		border-radius: 5rpx;
		margin: 100rpx auto 0;
		margin-top: 90rpx;
		z-index: 0;

	}

	.formContainer view {
		width: 100%;
		height: 80rpx;
		border: 1px solid #fff;
		margin: 60rpx;
		margin-left: 2rpx;
		border-radius: 5rpx;
	}

	.loginBtn {
		width: 100%;
		height: 80rpx;
		background-color: #ef8787;
		border-radius: 5px;
		color: #fff;
		text-align: center;
		line-height: 80rpx;
		font-size: 32rpx;
		margin-top: 5rpx;
		border: 0;
	}
	.loginBtn_zc{
		width: 100%;
		height: 80rpx;
		background-color: #ef8787;
		border-radius: 5px;
		color: #fff;
		text-align: center;
		line-height: 80rpx;
		font-size: 32rpx;
		margin-top: 50rpx;
		border: 0;
	}

	.usernameContainer image,
	.passwordContainer image {
		width: 40rpx;
		height: 40rpx;
		margin-top: 20rpx;
		margin-left: 30rpx;
		float: left;
		display: block;
	}

	.usernameContainer input,
	.passwordContainer input {
		width: 200px;
		float: left;
		display: block;
		height: 80rpx;
		margin-left: 10px;
		font-size: 32rpx;
	}
	.usernameContainer,
	.passwordContainer{
		background-color: #fff2ee;
	
	}

	.navBtn {
		font-size: 32rpx;
		text-align: center;
		margin: 0 auto;
		color: #aaa;
		display: block;
		margin-top: 30px;
	}

</style>
